<template lang="pug">
  div.table-empty
    s-table(
      ref="table"
      v-loading="loading"
      req-method="get"
      reqUrl="web/materials/borrow"
      :column="classesColumn"
      :filterProps="{fields: searchConfig, showBtns: false}"
      :queryPropsParams="{areaId: curArea.areaId}"
    )
      .table-operator(slot="table-operator")
        el-button.gradientVertical(size="large"  @click="actionHandle({}, 'add')" round) 新增
      template(slot="created" slot-scope="text, scope")
        span {{text | dateFilter('YYYY/MM/DD hh:mm:ss')}}
      template(slot="name" slot-scope="text, scope")
        span {{scope.materiels.name}}
      template(slot="category" slot-scope="text, scope")
        span {{scope.materiels.category.name}}
      template(slot="action" slot-scope="text, scope")
        el-link(@click="actionHandle(scope, 'return')" type="primary") 归还
    add-drawer(v-if="addVisible" :visible.sync="addVisible" @getList="() => refreshTable(true)")
</template>
<script>
import { mapGetters } from 'vuex'
import { column } from './config'
import AddDrawer from './components/addDrawer'
import { addSubmit } from './api'
import dayjs from 'dayjs'
export default {
  components: {
    AddDrawer
  },
  data () {
    return {
      classesColumn: column,

      classes: [],
      classId: '',

      loading: false,

      addVisible: false
    }
  },
  computed: {
    ...mapGetters(['curArea']),
    searchConfig () {
      return []
    }
  },
  created () {
  },
  methods: {
    refreshTable (flag = false) {
      this.$refs.table.refresh(flag)
    },
    actionHandle (row, type = 'unbind') {
      console.log(row)
      console.log(type)
      if (type === 'add') {
        this.addVisible = true
      } else if (type === 'return') {
        this.$prompt('请输入归还数量', '资产分类', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputType: 'number',
          inputValidator: (value) => {
            if (!value) {
              return '输入不能为空'
            }
          }
        }).then(({ value }) => {
          if (value) {
            this.returnMaterial(row, value)
          }
        })
      }
    },

    returnMaterial (row, value) {
      const date = dayjs(new Date()).format('YYYY/MM/DD')
      const params = {
        uid: row.uid,
        type: 2,
        date: date,
        remark: '',
        itemsStr: `${row.materiels.id},${value}`
      }
      addSubmit(params).then(res => {
        this.$message.info('归还成功')
        this.refreshTable()
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.video{
  width: 100%;
  height: 560px
}
.close{
  margin-top: 20px;
}
</style>
